<template>
    <div>
        <el-dropdown v-if="showDrop" trigger="click" @command="handlerChangeDepartment">
                <span v-if="language === 'cn'" class="el-dropdown-link">{{currentManageDptName}}
                    <i class="el-icon-arrow-down el-icon--right"></i>
                </span>
            <el-dropdown-menu slot="dropdown">
                <el-dropdown-item
                    v-for="(item, index) in manageDpts"
                    :key="index"
                    :command="item"
                >{{item.name}}</el-dropdown-item>
            </el-dropdown-menu>
        </el-dropdown>
        <span v-else>{{currentManageDptName}}</span>
    </div>
</template>
<script>
import Bus from "common/src/utils/bus";
import { queryDic } from "common/src/api/dictionary";
import { updateCurrentManageDptId } from "common/src/api/session";
import mixin from 'common/src/mixins/index';
export default {
    inject: ["reload"],
    mixins: [mixin],
    data() {
        return {
            currentLang: this.$store.getters.language,
            showDrop: false,
            manageDpts: [],
            currentManageDptId: "",
            currentManageDptName: ""
        };
    },
    computed: {
        language() {
            return this.$store.getters.language;
        }
    },
    created() {
      Bus.$on("goToPost", () => {
        this.handlerChangeDepartment({id: '2'})
      });
    },
    mounted() {
        this.getOptions();
    },
    methods: {
        async getOptions() {
            let params = {
                lang: this.$store.getters.language || "cn",
                type: "allChild",
                keys: ["X_GLBM"]
            };
            let res = await queryDic(params);
            // 切换用户时 mockuser数据同步部门切换 user值取当前显示用户（mockuser or user）
            let user = this.global.currentUser;
            let { manageDptIds, currentManageDptId } = user;
            this.manageDptIds = manageDptIds;
            this.showDrop =
                (currentManageDptId &&
                    manageDptIds &&
                    manageDptIds.length > 1) ||
                !currentManageDptId;
            this.currentManageDptId = currentManageDptId;
            let {
                code,
                data: { X_GLBM }
            } = res;
            if (code === 200) {
                let dpts = Object.keys(X_GLBM).map(item => ({
                    name: X_GLBM[item],
                    id: item
                }));
                if (this.showDrop) {
                    this.manageDpts =
                        manageDptIds &&
                        manageDptIds instanceof Array &&
                        manageDptIds.length > 0
                            ? dpts.filter(item => {
                                  return (
                                      this.manageDptIds.indexOf(item.id) > -1
                                  );
                              })
                            : [];
                }
                this.currentManageDptName =
                    X_GLBM[this.currentManageDptId] ||
                    this.$t("common.pla.pleaseSelect");
            }
        },
        initLocalTabs() {
            let tabs = this.$store.state.common.tabs.slice(0);
            localStorage.setItem("tabs", JSON.stringify(tabs));
        },
        handlerChangeDepartment(item) {
            if (item.id == this.currentManageDptId) return;
            updateCurrentManageDptId(item.id).then(res => {
                let { code, data } = res;
                if (code === 200) {
                    this.currentManageDptName = item.name;
                    this.currentManageDptId = item.id;
                    this.$message({
                        type: "success",
                        message: this.$t("identity.toggleSuccess")
                    });
                    this.$emit("updateCurrentManageDptId", item.id);
                    this.initLocalTabs()
                    this.$store.commit("set_session_data", data);
                    this.reload();
                }
            });
        }
    }
};
</script>
<style lang="scss" scoped>
.lang-text {
    cursor: pointer;
    color: #3A7FE8;
}
.el-dropdown-link {
    cursor: pointer;
    color: #3A7FE8;
  }
</style>
